$style: #e5373b;
#expr {
	background-color: #fafafa;
	padding:24rpx 32rpx;
	.main {
		background-color: #fff;
		border-radius:8rpx;
		padding:40rpx 0 50rpx;
		.top {
			display: flex;
			padding-left:84rpx;
			padding-right:38rpx;
			word-break: break-all;
			position: relative;
			z-index: 4;
			text {
				display: block;
				flex-shrink: 0;
				width:48rpx;
				height:48rpx;
				border-radius: 50%;
				background-color: $style;
				line-height:48rpx;
				text-align: center;
				font-size:24rpx;
				color: #fff;
			}
			view {
				font-size:24rpx;
				margin-left:15rpx;
				margin-top: 5rpx;
			}
		}
		.list {
			width: 100%;
			.item {
				display: flex;
				justify-content: space-between;
				position: relative;
				padding:40rpx 35rpx 0 0;
				color: #ccc;
				.date {
					width:92rpx;
					text-align: right;
					.day {
						font-size:24rpx;
					}
					.time {
						font-size:20rpx;
					}
				}
				.texts {
					width: 500rpx;
					.state {
						font-size:28rpx;
						line-height:28rpx;
						margin-top:3rpx;
					}
					.content {
						font-size:24rpx;
						margin-top:5rpx;
						view {
							color: $style;
						}
					}
				}
				text.line {
					display: block;
					width: 1px;
					height: 150%;
					background-color: #f0f0f0;
					position: absolute;
					top: -30%;
					left: 108rpx;
				}
				text.dot {
					display: block;
					width:15rpx;
					height:15rpx;
					border-radius: 50%;
					background-color: #ccc;
					position: absolute;
					top:52rpx;
					left: 101rpx;
					z-index: 2;
				}
				&.active {
					color: #333;
					text.dot {
						background-color: $style;
					}
				}
			}
		}
	}
}